<template>
  <div class="container">
    <h3>新增轮播图</h3>
    商品id：
    <el-input size="small " type="text" v-model="newSwiper.goods_id" /> <br />

    图片路径:
    <el-input size="small " type="text" v-model="newSwiper.image_src" /> <br />

    导航地址:
    <el-input size="small " type="text" v-model="newSwiper.navigator_url" />
    <br />

    打开方式：
    <el-input size="small " type="text" v-model="newSwiper.open_type" /> <br />

    <el-button type="primary" @click="add">确认新增</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      newSwiper: {
        goods_id: "601fa4888820000078006717",
        image_src: "https://img2.baidu.com/it/u=2004014431,429829261&fm=26&fmt=auto",
        navigator_url: "/pages/goods_detail/index?goods_id=38",
        open_type: "navigate"
      },
    };
  },
  methods: {
    // 增加
    add() {
      this.$api.bannerApi.addSwiper(this.newSwiper).then(({ data }) => {
        console.log(data);
        this.$message.success(data.message);
      });
    },
  }
};
</script>

<style scoped>
.img {
  margin-bottom: 10px;
}
.container {
  background-color: #fff;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  padding: 30px;
}
</style>
